<template>
  <div style="height: 100%;">
    <!-- {{ see }} -->
    <!-- {{ calData }} -->
    <div style="display:flex;height: 100%;padding-top:1vh">
      <div class="tre">
        <el-tree ref="tree" class="tree" show-checkbox :default-checked-keys="[]" node-key='organizeid' :indent="0"
          highlight-current :data="treeData" :props="defaultProps" default-expand-all @node-click="handleNodeClick"
          @check="handleCheckChange"></el-tree>
        <!-- @check-change="handleCheckChange" -->
      </div>
      <div style="height:100%">
        <div>
          <!-- <el-button type="primary" plain class="button" @click="quickSave">展开快速保存>></el-button> -->
          <div class="grid">
            <!-- <span>排班配置</span> -->
            <div class="head">
              <el-button type="success" plain class="button" @click="quickSave">快速保存</el-button>
              <el-button plain class="smal" style="margin-bottom:2px" @click="bigSmall = 7">大周</el-button>
              <el-button plain class="smal" style="transform: translate(-10px,0);margin-bottom:2px"
                @click="bigSmall = 6">小周</el-button>
              <div class="block">
                <el-date-picker class="smal" v-model="value1" type="daterange" range-separator="至"
                  start-placeholder="开始日期" end-placeholder="结束日期">
                </el-date-picker>
              </div>

              <el-select placeholder="选择班次" v-model="selectTime" style="width:200px">
                <template v-for="obj in seData">

                  <el-option :label="obj.WorkingTimesName" :value="obj.WorkingTimesName"></el-option>
                </template>
              </el-select>

              <!-- <el-checkbox class="check" v-model="checked">是否循环大小周</el-checkbox> -->
            </div>

            <el-row class="one">
              <el-col :span="3">
                <div class="grid-content bg-purple-light"></div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content bg-purple-light">周一</div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content bg-purple-light">周二</div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content bg-purple-light">周三</div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content bg-purple-light">周四</div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content bg-purple-light">周五</div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content bg-purple-light">周六</div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content bg-purple-light">周日</div>
              </el-col>
            </el-row><el-row>
              <el-col :span="3">
                <div class="grid-content ">上班人数</div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[0].Peoples"></el-input></div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[1].Peoples"></el-input></div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[2].Peoples"></el-input></div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[3].Peoples"></el-input></div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[4].Peoples"></el-input></div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[5].Peoples"></el-input></div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[6].Peoples"></el-input></div>
              </el-col>
            </el-row><el-row>
              <el-col :span="3">
                <div class="grid-content ">上班时长</div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[0].WorkTime"></el-input>
                </div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[1].WorkTime"></el-input>
                </div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[2].WorkTime"></el-input>
                </div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[3].WorkTime"></el-input>
                </div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[4].WorkTime"></el-input>
                </div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[5].WorkTime"></el-input>
                </div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[6].WorkTime"></el-input>
                </div>
              </el-col>
            </el-row><el-row>
              <el-col :span="3">
                <div class="grid-content ">加班时长</div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[0].OverTime"></el-input>
                </div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[1].OverTime"></el-input>
                </div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[2].OverTime"></el-input>
                </div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[3].OverTime"></el-input>
                </div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[4].OverTime"></el-input>
                </div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[5].OverTime"></el-input>
                </div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[6].OverTime"></el-input>
                </div>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="3">
                <div class="grid-content ">累计时长</div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[0].TotalHours"></el-input>
                </div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[1].TotalHours"></el-input>
                </div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[2].TotalHours"></el-input>
                </div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[3].TotalHours"></el-input>
                </div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[4].TotalHours"></el-input>
                </div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[5].TotalHours"></el-input>
                </div>
              </el-col>
              <el-col :span="3">
                <div class="grid-content "><el-input class="colContant" v-model="quickData[6].TotalHours"></el-input>
                </div>
              </el-col>
            </el-row>
          </div>
        </div>
        <div style="border-bottom: 1px dashed #999;width: 100%;margin-bottom: 6px;"></div>
        <div class="cal">
          <span style="margin:  0 -8px 10px 20px;">排班日历</span>
          <el-select class="smal Minp" placeholder="批量设置班次" v-model="Mselect">
            <el-option class="smal" label="9小时班制" value="9小时班制"></el-option>
            <el-option class="smal" label="11.5小时班制" value="11.5小时班制"></el-option>
          </el-select>
          <div style="position: relative;">
            <!-- <div class="span">排班日历</div>
            <el-input  style="height:20px;width: 12vw;" v-model="input" placeholder="选择班次"></el-input> -->
            <el-button class="Lsave" type="success" plain @click="saveCalendar">保存</el-button>
          </div>
          <div class="Dcalend">
            <el-calendar>
              <!-- 这里使用的是 2.5 slot 语法，对于新项目请使用 2.6 slot 语法-->
              <template slot="dateCell" slot-scope="{date, data}">
                <!-- <div style="display: flex;"> -->
                <p class="p">
                  {{ data.day.split('-').slice(1).join('-') }}
                </p>
                <!-- <el-checkbox style="display: inline-block;" v-model="checked">备选项</el-checkbox> -->
                <!-- </div> -->

                <div style="display: none;">
                  {{ day = data.day.slice(0, 7) }}
                </div>
                <div v-for="(item, key) in calData" :key="key">
                  <!-- {{ data.day }} -->
                  <el-form style="float: left;" class="from" v-if="data.day == key" :model="item">
                    <div style="display: none;">
                      {{ item.WorkingDate = data.day }}
                    </div>
                    <el-checkbox class="checkAbs" v-model="item.Remark1">休</el-checkbox>
                    <div>
                      <div class="col">
                        <div>班次:</div>
                        <el-select class="inp" :disabled="item.Remark1" v-model="item.WorkingTimesID" placeholder="">
                          <el-option label="9小时班制" value="9小时班制"></el-option>
                          <el-option label="11.5小时班制" value="11.5小时班制"></el-option>
                        </el-select>
                      </div>
                      <div class="col">
                        <div>上班人数:</div>
                        <el-input class="inp" :disabled="item.Remark1" v-model="item.Peoples"></el-input>
                      </div>
                      <div class="col">
                        <div>加班时长:</div>
                        <el-input class="inp" :disabled="item.Remark1" v-model="item.OverTime"></el-input>
                      </div>
                      <div class="col">
                        <div>总时长:</div>
                        <el-input class="inp" :disabled="item.Remark1" v-model="item.TotalHours"></el-input>
                      </div>
                    </div>
                  </el-form>


                </div>

              </template>
            </el-calendar>
          </div>

        </div>
      </div>

    </div>



  </div>
</template>

<script>
import { GetSaveData, getDataList, DeleteForm, CloseForm, UpdateForm, getfunDownload, MenuUpdate } from '@/api/CommonPage/CommonPage'; //更改
// import { getDataListS } from '@/api/System';

// import { UpdateForm } from '@/api/CommonPage/CommonPage'; //更改


export default {
  name: 'OrganizeWorkingTimesDetail',
  data() {
    return {
      checkedCel: false,
      input: '',
      bigSmall: 6,
      quickData: [
        {}, {}, {}, {}, {}, {}, {}
      ],
      selectTime: null,
      Mselect: null,
      selectData: [],
      checked: false,
      value1: '',
      resCal: {},
      ID: null,
      see: [],
      treeData: [],
      dayNow: null,
      day: null,
      falg: false,
      FormData: [],
      save: false,
      calData: {},
      value: new Date(),
      resSelect: [],
      SearchTree: {
        // 查询条件
        total: 0, // 总记录数
        pageSize: 0, // 一页显示的记录数
        page: 1, // /当前页码
        RNO: "1626", // 表编号  根据Controller中对应的表编号
        InterID: "1626",
        jsWhere: "", // 自定义条件
        Download: "",
        IsFieldText: "0",
        // AppCode: 'A05',
        // Status: 2,
        // BillState: "BillStateALL"
      },
      SearchGroup: {
        // 查询条件
        total: 0, // 总记录数
        pageSize: 0, // 一页显示的记录数
        page: 1, // /当前页码
        RNO: "1592", // 表编号  根据Controller中对应的表编号 //更改
        InterID: "1592",
        jsWhere: "", // 自定义条件
        Download: "",
        IsFieldText: "0",
        // Status: 0,
        //   BillState: "BillStateALL",
      },
      SearchSelect: {
        // 查询条件
        total: 0, // 总记录数
        pageSize: 100, // 一页显示的记录数
        page: 1, // /当前页码
        RNO: "1596", // 表编号  根据Controller中对应的表编号 //更改
        InterID: "1596",
        jsWhere: "", // 自定义条件
        Download: "",
        IsFieldText: "0",
        // Status: 0,
        //   BillState: "BillStateALL",

      },
      SearchHoliday: {
        // 查询条件
        total: 0, // 总记录数
        pageSize: 100, // 一页显示的记录数
        page: 1, // /当前页码
        RNO: "1609", // 表编号  根据Controller中对应的表编号 //更改
        InterID: "1609",
        jsWhere: "", // 自定义条件
        Download: "",
        IsFieldText: "0",
        // Status: 0,
        //   BillState: "BillStateALL",
      },
      SearchWork: {
        // 查询条件
        total: 0, // 总记录数
        pageSize: 100, // 一页显示的记录数
        page: 1, // /当前页码
        RNO: "1627", // 表编号  根据Controller中对应的表编号 //更改
        InterID: "1627",
        jsWhere: "", // 自定义条件
        Download: "",
        // Status: 0,
        //   BillState: "BillStateALL",
      },
      Linedata: '',
      OrganizeID: '',
      YearMonth: '',
      OrganizeWorkingTimesID: null,
      seData:[],

    };
  },
  async created() {
    // this.Generate()
    this.getData()

  },
  mounted() {
    this.setHeight()
  },
  watch: {
    day(day) {
      // if(day ==new Date()) 
      this.dayNow = this.subtractOneMonth(day)
      this.getCalData(this.dayNow)
      // alert(this.dayNow)
    },

    Mselect(time) {
      for (let o in this.calData) {
        this.calData[o].WorkingTimesID = time
      }
      // this.calData
    },
    //快速选择班次
    async selectTime(time) {
      const res = await getDataList({ data: JSON.stringify(this.SearchSelect) });
      this.selectData = res.data.Table.filter(v => !v.ParentWorkingTimesID)
      let date = this.selectData.filter(v => v.WorkingTimesName == time)
      debugger
      this.quickData = [{ WorkTime: '', OverTime: '', TotalHours: '' }, { WorkTime: '', OverTime: '', TotalHours: '' },
      { WorkTime: '', OverTime: '', TotalHours: '' }, { WorkTime: '', OverTime: '', TotalHours: '' },
      { WorkTime: '', OverTime: '', TotalHours: '' }, { WorkTime: '', OverTime: '', TotalHours: '' },
      { WorkTime: '', OverTime: '', TotalHours: '' }]
      for (let i = 0; i < this.bigSmall; i++) {
        this.quickData[i].WorkTime = date[0].WorkHour
        this.quickData[i].OverTime = date[0].OverTimeHour
        this.quickData[i].TotalHours = date[0].TotalHour
      }
    },
    //大小周
    bigSmall(s) {
      let obj = {}
      let date = this.selectData.filter(v => v.WorkingTimesName == this.selectTime)
      if (s == 7) {
        // alert(s)
        obj.OverTime = date[0].WorkHour
        obj.WorkTime = date[0].OverTimeHour
        obj.TotalHours = date[0].TotalHour
        this.quickData.splice(6, 1)
        this.quickData.push(obj)
      } else {
        this.quickData.splice(6, 1)
        this.quickData.push(obj)
      }
    },

  },
  methods: {
    setHeight() {
      // alert(1)
      var height = window.innerHeight;
      var element = document.querySelector('.Dcalend');
      element.style.height = height - 302 + 'px';
    },
    //快速保存
    async quickSave() {
      if (!this.selectTime) {
        this.$message({
          showClose: true,
          message: '请选择班次',
          type: 'warning'
        });
        return
      }
      if (!this.value1) {
        this.$message({
          showClose: true,
          message: '请选择月份',
          type: 'warning'
        });
        return
      }
      if (!this.ID) {
        this.$message({
          showClose: true,
          message: '请选择线别',
          type: 'warning'
        });
        return
      }

      let timeDiff = Math.abs(this.value1[1].getTime() - this.value1[0].getTime());
      //开始结束日期相差的天数
      let diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
      // this.see = diffDays
      let week = this.value1[0].getDay()//星期几
      let start = this.value1[0]
      // this.see = week
      let save = []
      for (let i = 0; i < diffDays + 1; i++) {
        let obj = {
          OverTime: null,
          OrganizeID: this.ID,
          WorkingTimesDetailID: null,
          WorkingDate: null,
          CreatedBy: null,
          CreatedByName: null,
          ModifiedBy: null,
          ModifiedByName: null,
          CreatedOn: null,
          ModifyedOn: null,
          Peoples: null,
          TotalHours: null,
          WorkingTimesID: this.selectTime,
          WorkTime: null,
          Remark1: null,
        }
        //日期
        obj.WorkingDate = this.getFormattedDate(start)
        let j = (i + week - 1) % 7
        // let b = (j - 1) % 7
        obj.Peoples = this.quickData[j].Peoples
        obj.OverTime = this.quickData[j].OverTime
        obj.WorkTime = this.quickData[j].WorkTime
        obj.TotalHours = this.quickData[j].TotalHours
        save.push(obj)
        //日期加1
        start.setDate(start.getDate() + 1);
      }
      start.setDate(start.getDate() - diffDays - 1);

      //根据日期从日历数据取ID
      save.forEach(v => {
        this.resCal.some(x => {
          if (x.WorkingDate == v.WorkingDate) {
            v.WorkingTimesDetailID = x.WorkingTimesDetailID
            return true
          }

        })
      })

      let options = "保存中...";
      const loading = this.$loading({
        lock: true,
        text: options,
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      });
      for (let o of save) {
        if (o.Remark1 === true) {
          o.Remark1 = '1'
        } else {
          o.Remark1 = '0'
        }
        //清楚勾选的数据
        if (o.Remark1 === '1') {
          o.Peoples = null
          o.OverTime = null
          o.WorkTime = null
          o.TotalHours = null
          o.WorkingTimesID = null
        }
        //线别=>ID
        this.resSelect.forEach(v => {
          if (v.WorkingTimesName === o.WorkingTimesID) o.WorkingTimesID = v.WorkingTimesID
        })
      }
      // for (let v of save) {
      var result = await GetSaveData({
        IsPostBack: true,
        InterID: this.SearchGroup.InterID,
        BodyDate: JSON.stringify(save)
      });
      // }

      if (result.code === 20000) {
        this.$notify({
          title: result.msg,
          dangerouslyUseHTMLString: true,
          message: "",
          type: "success",
        });

        // this.getDataList();
      } else {
        this.$notify({
          title: result.msg,
          dangerouslyUseHTMLString: true,
          message: "",
          type: "error",
        });
      }
      loading.close();
      this.resCal = await getDataList({ data: JSON.stringify(this.SearchGroup) });
      this.getCalData(this.dayNow)
      
      let dataTo = save[0].WorkingDate.split('-')
      this.SearchWork.OrganizeID = this.ID
      this.SearchWork.YearMonth = dataTo[0] + dataTo[1]
      let res = await getDataList({ data: JSON.stringify(this.SearchWork) })
      let d = res.data.Table[0] || { OrganizeWorkingTimesID: '' }
      d.OrganizeID = this.Linedata.organizeid;
      d.Status = 1;
      d.YearMonth = dataTo[0] + dataTo[1];
      d.LineName = this.Linedata.label
      // debugger
      let result1 = await UpdateForm({
        IsPostBack: true,
        InterID: 1627,
        SavaDate: JSON.stringify(d)
      });
    },

    //获取yyyy-mm-dd格式日期
    getFormattedDate(date) {
      let year = date.getFullYear();
      let month = date.getMonth() + 1; // 注意，月份是从0开始的，所以要加1  
      let day = date.getDate();

      month = month < 10 ? "0" + month : month; // 如果月份小于10，前面补0  
      day = day < 10 ? "0" + day : day; // 如果日期小于10，前面补0  
      return year + "-" + month + "-" + day;
    },

    async handleNodeClick(data) {
      if (!data.children) {
        this.ID = data.organizeid
        this.Linedata = data
        this.getCalData(this.dayNow)
        // this.see = data
        // data.organizeid
        //单选
        let tree = this.$refs.tree
        let arr = []
        arr.push(data.organizeid)
        tree.setCheckedKeys(arr)


      }
    },
    handleCheckChange(data, checked) {
      this.handleNodeClick(data)

      let tree = this.$refs.tree
      let arr = []
      arr.push(data.organizeid)
      tree.setCheckedKeys(arr)
    },
    async getData() {

      // this.see = res.data.Table.filter(v => !v.ParentWorkingTimesID)

      const resTree = await getDataList({ data: JSON.stringify(this.SearchTree) });
      this.SearchTree.IsFieldText = "1"; //已加载数据，不再加载
      const treeData = this.toTree(resTree.data.Table)
      this.treeData = treeData;

      // this.resCal = await getDataList({ data: JSON.stringify(this.SearchGroup) });
      // this.treeDataSave = resTree.data.Table
      const resSelect = await getDataList({ data: JSON.stringify(this.SearchSelect) });
      this.SearchSelect.IsFieldText = "1"; //已加载数据，不再加载
      this.resSelect = resSelect.data.Table.filter(v => !v.ParentWorkingTimesID)
      this.seData = resSelect.data.Table
      debugger
    },

    toTree(data, ParentCode = null) {
      let temp = [];
      data.forEach(item => {
        if (item.forganizeid == ParentCode) {
          const children = this.toTree(data, item.organizeid);
          if (children.length) {
            item.children = children;
          }
          temp.push(item);
        }
        item.label = item.organizename
      });
      return temp;
    },
    //月份倒退一个月
    subtractOneMonth(monthString) {
      // 解析年份和月份  
      const [year, month] = monthString.split('-').map(Number);
      // 计算前一个月的年份和月份  
      let newMonth = month - 1;
      let newYear = year;
      // 如果月份是1（即1月），则需要倒退到上一年的12月  
      if (newMonth < 1) {
        newMonth = 12;
        newYear--;
      }
      // 格式化新的年份和月份为字符串  
      const newMonthString = String(newMonth).padStart(2, '0');
      const newYearString = String(newYear);

      // 返回倒退一个月后的 "yyyy-MM" 字符串  
      return `${newYearString}-${newMonthString}`;
    },

    async getCalData(day) {
      let now = new Date()
      if (day) now = new Date(day)
      let year = now.getFullYear()
      let month = now.getMonth() + 1
      let time = `${year}-${month < 10 ? `0${month}` : month}`

      if (!this.ID) return
      // this.SearchGroup.jsWhere = `and OrganizeID = ${this.ID}`
      this.SearchGroup.OrganizeID = this.ID
      // this.SearchGroup
      //线别数据
      const resTree = await getDataList({ data: JSON.stringify(this.SearchGroup) })
      if (resTree.IsFieldText == "0") this.SearchGroup.IsFieldText = "1"; //已加载数据，不再加载
      let su = resTree.data.Table
      this.resCal = su
      //线别当月数据
      let data = su.filter(v => String(v.WorkingDate.slice(0, 7)) == String(time))
      let obj = this.Generate(day)
      data.forEach(v => {
        obj[String(v.WorkingDate.slice(0, 10))] = v
      })

      // and NodesForganizeid like '%ERP15801%
      this.SearchHoliday.jsWhere = `and NodesForganizeid like '%${this.ID}%'`
      const res = await getDataList({ data: JSON.stringify(this.SearchHoliday) })
      if (res.IsFieldText == "0") this.SearchHoliday.IsFieldText = "1"; //已加载数据，不再加载
      let da = res.data.Table
      this.calData = obj;
      for (let o in this.calData) {
        //勾选数据转换
        if (this.calData[o].Remark1 == 1) {
          this.calData[o].Remark1 = true
        } else {
          this.calData[o].Remark1 = false
        }
        //放假勾选
        if (da.length && new Date(o) >= new Date(da[0].StartDate.slice(0, 10)) && new Date(o) <= new Date(da[0].EndDate.slice(0, 10))) this.calData[o].Remark1 = true
        //ID->线别
        this.resSelect.forEach(v => {
          v.WorkingTimesID
          if (v.WorkingTimesID === this.calData[o].WorkingTimesID) this.calData[o].WorkingTimesID = v.WorkingTimesName
        })
      }
    },

    //保存日历
    async saveCalendar() {
      if (this.Mselect === null) {
        this.$message.warning("请选择班次");
        return
      }
      // if (!this.value1) this.$message.warning("请选择月份");
      if (this.ID === null) {
        this.$message.warning("请选择线别");
        return
      }
      let options = "保存中...";
      const loading = this.$loading({
        lock: true,
        text: options,
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      });
      for (let o in this.calData) {
        //勾选数据转换
        if (this.calData[o].Remark1 === true) {
          this.calData[o].Remark1 = '1'
        } else {
          this.calData[o].Remark1 = '0'
        }
        //清楚勾选的数据
        if (this.calData[o].Remark1 === '1') {
          this.calData[o].Peoples = null
          this.calData[o].OverTime = null
          this.calData[o].WorkTime = null
          this.calData[o].TotalHours = null
          this.calData[o].WorkingTimesID = null
        }
        //线别ID转换
        this.resSelect.forEach(v => {
          if (v.WorkingTimesName === this.calData[o].WorkingTimesID) this.calData[o].WorkingTimesID = v.WorkingTimesID
        })
      }
      let data = []
      for (let v in this.calData) {
        data.push(this.calData[v])
      }

      let dataTo = data[0].WorkingDate.split('-')

      this.SearchWork.OrganizeID = this.ID
      this.SearchWork.YearMonth = dataTo[0] + dataTo[1]
      let res = await getDataList({ data: JSON.stringify(this.SearchWork) })
      let d = res.data.Table[0] || { OrganizeWorkingTimesID: '' }
      d.OrganizeID = this.Linedata.organizeid;
      d.Status = 1;
      d.YearMonth = dataTo[0] + dataTo[1];
      d.LineName = this.Linedata.label
      // debugger
      let result1 = await UpdateForm({
        IsPostBack: true,
        InterID: 1627,
        SavaDate: JSON.stringify(d)
      });
      if (result1.code === 20000) {
        let result = await GetSaveData({
          IsPostBack: true,
          InterID: this.SearchGroup.InterID,
          BodyDate: JSON.stringify(data)
        });
        if (result.code === 20000) {

          this.$notify({
            title: result.msg,
            dangerouslyUseHTMLString: true,
            message: "",
            type: "success",
          });
          // this.getDataList();
        } else {
          this.$notify({
            title: result.msg,
            dangerouslyUseHTMLString: true,
            message: "",
            type: "error",
          });
        }
        loading.close();
        this.resCal = await getDataList({ data: JSON.stringify(this.SearchGroup) });
        this.getCalData(this.dayNow)
      } else {
        this.$notify({
          title: result1.msg,
          dangerouslyUseHTMLString: true,
          message: "",
          type: "error",
        });
      }
    },

    //生成结构数据
    Generate(dayNow) {
      let generateData = {}
      Object.defineProperty(generateData, 'push', {
        value: function (key, value) {
          this[key] = value;
        },
        enumerable: false,
        writable: true,
        configurable: true
      });
      let now = new Date();
      if (dayNow) now = new Date(dayNow)
      // 设置日期为当前月份的第一天  
      now.setDate(1);
      let month = now.getMonth()
      // 循环生成整个月的日期数据  
      while (month == now.getMonth()) {
        // 获取年、月、日  
        let year = now.getFullYear();
        let month = now.getMonth() + 1; // 注意：getMonth()返回的月份是从0开始的，所以需要+1 
        // let  
        let day = now.getDate();
        let attribute = `${year}-${month < 10 ? `0${month}` : month}-${day < 10 ? `0${day}` : day}`
        // const result = await UpdateForm({
        //   IsPostBack: true,
        //   InterID: this.SearchGroup.InterID,
        //   SavaDate: JSON.stringify(this.FormData)
        // });
        // let Data = result.data1.Table[0];
        generateData.push(attribute, {
          OverTime: null,
          OrganizeID: this.ID,
          WorkingTimesDetailID: null,
          WorkingDate: null,
          CreatedBy: null,
          CreatedByName: null,
          ModifiedBy: null,
          ModifiedByName: null,
          CreatedOn: null,
          ModifyedOn: null,
          Peoples: null,
          TotalHours: null,
          WorkingTimesID: null,
          WorkTime: null,
          Remark1: 0,
        })
        now.setDate(day + 1);
      }
      // let data = {}
      // data = JSON.parse(JSON.stringify(generateData))
      return generateData

    }
  }
};
</script>

<style lang="scss">
.grid {
  width: 100%;
  padding: 4px 6px;
  margin-bottom: 1vh;




  .head {
    display: flex;
    position: relative;

    .el-input--medium .el-input__inner {
      height: 30px;
      line-height: 30px;
    }

    .el-input__suffix {
      // transform: translateY(4px);
      height: 34px;
    }

    .el-input__suffix .is-reverse {
      transform: translateY(-3px);
    }
  }

  .smal {
    height: 30px;
    line-height: 0px;
  }

  .button {
    margin-bottom: 2px;
    position: absolute;
    right: 4px;
    height: 30px;
    line-height: 0px;
  }

  .colContant input {
    // margin-top:2px;
    transform: translate(0, 1px);
    line-height: 20px;
    height: 20px;
  }

  .check {
    line-height: 34px;
    margin-left: 20px;
  }

  .block {
    display: inline-block;
    margin: 0 20px;

    &:hover {
      cursor: pointer;
    }
  }

  .el-row {
    // margin-bottom: 20px;

    &:last-child {
      margin-bottom: 0;
    }
  }

  .one {
    font-weight: 600;
  }

  // .el-col {
  //   border-radius: 4px;
  // }

  .bg-purple-dark {
    background: #99a9bf;
  }

  .bg-purple {
    background: #d3dce6;
  }

  .bg-purple-light {
    background: #e5e9f2;
  }

  .grid-content {
    // border-radius: 4px;
    height: 24px;
    border: 1px solid rgb(229, 230, 232);
    line-height: 24px;
    padding: 0 6px;
    font-size: 12px;
    color: #313131fc;
  }

  .row-bg {
    padding: 10px 0;
    background-color: #f9fafc;
  }
}


.tre {
  // margin-top:0vh;
  padding: 4px 1vw;
  height: 100%;
  width: 16vw;
  box-shadow: 0px 0px 2px #888;
  overflow: scroll;
  scrollbar-width: thin;



  // 以下为scss，记得去掉scoped，或者使用/deep/
  .tree {

    // .is-current{
    //   background-color: blue;
    // }

    // .el-tree-node__content:hover {
    // background: rgba(131, 134, 132, 0.169);
    // color: blue;
    // }

    .is-current>.el-tree-node__content {
      // background-color: rgba(49, 99, 173, 0.199);
      color: rgb(64, 158, 255);
      font-weight: 600;
    }

    .el-tree-node {
      position: relative; // 缩进量
    }

    .el-tree-node__children {
      padding-left: 16px; // 缩进量
      // position: relative;
    }

    .el-tree-node__content::after {
      content: "";
      width: 12px;
      height: 25px;
      position: absolute;
      left: -4px;
      top: -12px;
      border-width: 1px;
      border-bottom: 1px dashed #52627C;
      border-left: 1px dashed #52627C;
    }



  }
}

.tree>.el-tree-node>.el-tree-node__content::after {
  border: 0
}

.tree>.el-tree-node>.el-tree-node__children>.el-tree-node>.el-tree-node__content::after {
  border-left: 0;
}


.tree>.el-tree-node>.el-tree-node__children>.el-tree-node::after {
  content: "";
  width: 12px;
  height: 100%;
  position: absolute;
  left: -4px;
  top: -12px;
  border-width: 1px;
  // border-bottom: 1px dashed #52627C;
  border-left: 1px dashed #52627C;
}


.Dcalend {
  border: solid 1px #ddd;
  margin: 0 20px 20px 20px;
  overflow: scroll;
  // height: 100%;
}

.cal {
  width: 76vw;
  // height: 458px;
  // position: absolute;
  right: 8px;
  top: 32vh;
  // scrollbar-width: thin;
  // overflow: scroll;

  .from {
    position: relative;

    .checkAbs {
      position: absolute;
      right: -34px;
      top: -23px;
    }
  }

  .Lsave {
    height: 30px;
    line-height: 0px;
    position: absolute;
    right: 20px;
    top: -34px;
  }

  .Minp {
    width: 12vw;
    transform: scale(0.8);

    .el-input--medium {
      font-size: 18px !important;
    }
  }

  // /deep/ .el-input--medium .el-input__inner{
  //   height: 24px;
  //   line-height: 24px;
  // }
  // .span{
  //   // margin: ;
  //   color: #546179;
  //   line-height: 20px;
  //   font-size: 14px;
  //   height: 24px;
  //   line-height: 24px;
  // }
  .p {
    margin: 0px 0;
    // padding: 2px 0;
    height: 22px;
    width: 2vw;
    line-height: 8px;
    font-size: 12px;
  }

  .col {
    display: flex;
    align-items: center;

    div {
      font-size: 12px;
      width: 54px;
      line-height: 22px;
      color: rgb(29, 31, 32);
    }

    .el-input--medium .el-input__inner {
      padding: 0 0;
      height: 20px !important;
      line-height: 20px !important;
      width: 5.7vw;
    }

    .el-input__suffix {
      height: 30px;
      transform: translate(46px, 0);
    }

    .el-input__suffix .is-reverse {
      transform: translate(0, -7px);
    }
  }


}
</style>
